<template>
  <el-container class="page-main">
    <!-- 1页面左侧导航菜单 -->
    <el-aside class="main-sider">
      <!--<router-link tag="li" class="nav-link" :to="{name:'historyLink'}">-->
      <!--  <a class="list-group-item list-group-item-action">历史订单111</a>-->
      <!--</router-link>-->
      <!--<br />-->
      <!--<router-link tag="li" class="nav-link" :to="{name:'contactLink'}">-->
      <!--  <a class="list-group-item list-group-item-action">联系我们</a>-->
      <!--</router-link>-->
      <!--<br />-->
      <!--<router-link tag="li" class="nav-link" :to="{name:'orderingGuideLink'}">-->
      <!--  <a class="list-group-item list-group-item-action">点餐文档</a>-->
      <!--</router-link>-->
      <!--<br />-->
      <!--<router-link tag="li" class="nav-link" :to="{name:'deliveryLink'}">-->
      <!--  <a class="list-group-item list-group-item-action">快递信息</a>-->
      <!--</router-link>-->
      <el-menu router unique-opened>
        <el-submenu index="/about">
          <template #title>
            <el-icon class="el-icon-menu"></el-icon>
            关于我们
          </template>
          <el-menu-item index="/about/history">
            <el-icon class="el-icon-menu" />
            <template #title> 历史订单</template>
          </el-menu-item>
          <el-menu-item index="/about/contact">
            <el-icon class="el-icon-menu" />
            <template #title> 历史订单</template>
          </el-menu-item>
          <el-menu-item index="/about/orderingGuide">
            <el-icon class="el-icon-menu"/>
            <template #title> 点餐文档</template>
          </el-menu-item>
          <el-menu-item index="/about/delivery">
            <el-icon class="el-icon-menu"/>
            <template #title> 快递信息</template>
          </el-menu-item>
          <el-menu-item index="/about/orgn">
            <el-icon class="el-icon-menu"/>
            <template #title> 公司管理</template>
          </el-menu-item>
        </el-submenu>
        <!--<menu-tree :menuTreeData="menuData"></menu-tree>-->
        <!--<el-menu-item index="/system/settings/dept">-->
        <!--  <el-icon class="el-icon-menu"/>-->
        <!--  <template #title> 部门管理</template>-->
        <!--</el-menu-item>-->
      </el-menu>
    </el-aside>
    <!-- 2页面主要显示内容 -->
    <!--<RouterView />-->
    <el-main class="main-content">
      <div class="content-header">
        <div>About 统一工具栏 / 当前导航面包屑</div>
      </div>
      <div class="content-body" ref="contentBodyHeight">
        <!--<div class="module-welcome" v-show="">-->
        <!--  <h3>About:欢迎Div</h3>-->
        <!--</div>-->
        <!-- 导航所对应的内容 -->
        <router-view></router-view>
      </div>
    </el-main>
  </el-container>
</template>

<script lang="ts">
import { defineComponent, onMounted } from 'vue';
// import MenuTree from '@/components/MenuTree.vue';

export default defineComponent({
  name: 'HomeAbout',
  components: {
    // MenuTree
  },
  setup (props, context) {
    // 1. 定义需要的数据
    // 2. 定义需要的方法
    const handleSelect = (path: any, key: any) => {
      console.log('HomeSystem >>> click on asider menu：', path, key);
    };
    // 3. 页面挂载初始化
    onMounted(() => {
      //
    });
    // 4. 返回需要暴露给页面使用的数据和方法
    return {
    };
  }
});
</script>
